// 维护保养
<template>
    <f7-page class="hntsh">
        <f7-navbar>
            <f7-nav-left>
                <f7-link back icon-material="chevron_left" force></f7-link>
            </f7-nav-left>
            <f7-nav-title>维护保养</f7-nav-title>
            <f7-nav-right></f7-nav-right>
        </f7-navbar>
        <Steps
            :currentStep="activeStep"
            :activeIndex="activeIndex"
            :stepsLabel="stepsLabel"
            @change="onChange"
        />
        <div class="content-list" v-if="currentStep == 0">
            <v-accordion title="维保计划" class="infoList noBorder" disabled>
                <van-form
                    input-align="right"
                    ref="form"
                    :readonly="!isWritePlan"
                >
                    <van-field
                        v-model="models.model.propertyCode"
                        @click-input="
                            isWritePlan
                                ? (showDevice = true)
                                : (showDevice = false)
                        "
                        readonly
                        required
                        :rules="[{ required: true, message: '请输入正确内容' }]"
                        label="维保设备"
                        placeholder="请选择"
                    >
                    </van-field>
                    <van-field
                        name="radio"
                        required
                        label="维保类型"
                        :rules="[{ required: true, message: '请输入正确内容' }]"
                    >
                        <van-radio-group
                            slot="input"
                            :disabled="!isWritePlan"
                            v-model="models.model.repairTypeCode"
                            direction="horizontal"
                        >
                            <van-radio
                                v-for="(
                                    item, index
                                ) in controlData.eqmRepairType"
                                :key="index"
                                :name="item.code"
                                >{{ item.name }}
                            </van-radio>
                        </van-radio-group>
                    </van-field>
                    <van-field
                        readonly
                        required
                        clickable
                        name="datetimePicker"
                        :value="models.model.repairTime"
                        label="进场时间 "
                        :rules="[{ required: true, message: '请输入正确内容' }]"
                        placeholder="请选择"
                        @click="
                            isWritePlan
                                ? (showPicker = true)
                                : (showPicker = false)
                        "
                    />

                    <van-popup v-model="showPicker" position="bottom">
                        <van-datetime-picker
                            type="date"
                            @confirm="onConfirm"
                            @cancel="showPicker = false"
                            :min-date="currentDate"
                            :max-date="maxDate"
                            :value="currentDate"
                        />
                    </van-popup>
                    <van-field
                        v-model="models.model.contactUserName"
                        required
                        label="联系人"
                        :rules="[{ required: true, message: '请输入正确内容' }]"
                        rows="1"
                        autosize
                        type="textarea"
                        placeholder="请输入"
                    >
                    </van-field>
                    <van-field
                        v-model="models.model.contactTel"
                        label="联系电话"
                        required
                        type="number"
                        :rules="[
                            {
                                validator: mobileRegex,
                                message: '请输入正确内容',
                            },
                        ]"
                        placeholder="请输入"
                    >
                    </van-field>
                </van-form>
            </v-accordion>
            <v-accordion title="维保人员" class="infoList noBorder" disabled>
                <v-person-list
                    :list="models.staffList"
                    :isDisabled="!isWritePlan"
                    @delete="deletePerson"
                />
                <div class="btn-box" v-if="isWritePlan">
                    <f7-button
                        fill
                        class="submit-btn person-btn"
                        @click="showProject = true"
                    >
                        <f7-icon
                            f7="plus"
                            size="18px"
                            style="margin-right: 5px"
                        ></f7-icon>
                        添加人员
                    </f7-button>
                </div>
            </v-accordion>
            <f7-toolbar
                position="bottom"
                no-shadow
                class="fff"
                v-if="isWritePlan"
            >
                <f7-button fill class="submit-btn del-btn" 
                    @click="delCreate" 
                    v-if="(models.model.repairStatus == 1 ||pageAction=='edit' ) && models.isRepairUnit"
                >
                    删除
                </f7-button>
                <f7-button fill class="submit-btn" @click="sure(1)"
                    >提交
                </f7-button>
            </f7-toolbar>
            <!-- 选择设备 -->
            <v-popup-device
                v-model="showDevice"
                url="/app/equipment/eqmRepair/queryRepairDeviceList"
                @save="suerDevice"
            >
            </v-popup-device>
            <!-- 选择人员 -->
            <v-popup-person
                v-model="showProject"
                url="/app/ent/entPersonJob/query"
                @save="suerPart"
                :chooseArr="models.staffList"
            >
            </v-popup-person>
        </div>
        <div class="content-list" v-if="currentStep == 1">
            <div class="tip-box">
                <f7-icon f7="info_circle" size="16px"></f7-icon>
                此模块由监理进行验证，其它用户无需操作；监理请对检测人员进行人脸拍照验证，系统自动识别！
            </div>
            <v-person-check
                :list="models.staffList"
                @check="checkPerson"
                :disabled="!isWrite1"
                title="维保人员"
            />
            <f7-toolbar position="bottom" no-shadow class="fff" v-if="isWrite1">
                <f7-button fill class="submit-btn" @click="sure(2)"
                    >认证完成
                </f7-button>
            </f7-toolbar>
        </div>
        <div class="content-list" v-if="currentStep == 2 || currentStep == 3">
            <v-picture-list
                :props="{ name: 'customName' }"
                :disabled="
                    models.model.repairStatus != 2 || !models.isRepairUser
                "
                listName="educationList"
                title="安全教育"
                typeCode="EQM_REPAIR_EDUCATION"
                :dataKey="models.model.repairId"
                :address="address"
                @onAfterQuery="getSafe"
                :attachCraneType="controlData.equipmentType"
                ref="safeListTotal"
            ></v-picture-list>
            <v-picture-list
                :props="{ name: 'customName' }"
                :disabled="
                    models.model.repairStatus != 2 || !models.isRepairUser
                "
                listName="personList"
                title="人员旁站"
                typeCode="EQM_REPAIR_PERSON"
                :address="address"
                :dataKey="models.model.repairId"
                @onAfterQuery="getPerson"
                :attachCraneType="controlData.equipmentType"
                ref="personListTotal"
            ></v-picture-list>
            <v-picture-list
                :props="{ name: 'customName' }"
                :disabled="
                    models.model.repairStatus != 2 || !models.isRepairUser
                "
                listName="processList"
                title="维保过程"
                typeCode="EQM_REPAIR_PROCESS"
                :address="address"
                :dataKey="models.model.repairId"
                @onAfterQuery="getProcess"
                :attachCraneType="controlData.property.equipmentType"
                ref="processListTotal"
            ></v-picture-list>
            <!-- <v-accordion title="维保过程" class="infoList">
                <f7-list media-list class="search-list pic-total">
                    <v-picture-item
                        v-for="(item, index) in processList"
                        :key="index"
                        :props="{ name: 'customName' }"
                        :index="index"
                        isDefaultFile
                        :disabled="
                            models.model.repairStatus != 2 ||
                            !models.isRepairUser
                        "
                        :item="item"
                        :ref="`processList${index + 1}`"
                        :dataKey="item.dataKey"
                        :bizType="item.bizType"
                        listName="processList"
                    />
                </f7-list>
            </v-accordion> -->
            <van-form
                input-align="right"
                ref="formData2"
                :readonly="
                    models.model.repairStatus != 2 || !models.isRepairUser
                "
            >
                <v-accordion title="维保内容" class="infoList">
                    <f7-list
                        media-list
                        class="search-list wbList"
                        v-if="models.repairContentList.length > 0"
                    >
                        <li
                            v-for="(item, index) in models.repairContentList"
                            :key="index"
                            class="content-box"
                        >
                            <div class="index-box">{{ index + 1 }}</div>
                            <div class="right-box">
                                <div class="code">{{ item.repairName }}</div>
                                <van-field
                                    v-model="item.repairContent"
                                    required
                                    label="维保内容"
                                    rows="1"
                                    autosize
                                    type="textarea"
                                    placeholder="请输入"
                                    :rules="[
                                        {
                                            required: true,
                                            message: '请输入正确内容',
                                        },
                                    ]"
                                >
                                </van-field>
                                <van-field
                                    v-model="item.memo"
                                    label="备注"
                                    rows="1"
                                    autosize
                                    type="textarea"
                                    placeholder="请输入"
                                >
                                </van-field>
                            </div>
                        </li>
                    </f7-list>
                </v-accordion>
                <v-accordion title="维保结论" class="infoList">
                    <van-field
                        name="radio"
                        required
                        label="结论"
                        :rules="[
                            { validator: isQual, message: '请输入正确内容' },
                        ]"
                    >
                        <van-radio-group
                            slot="input"
                            :disabled="
                                models.model.repairStatus != 2 ||
                                !models.isRepairUser
                            "
                            v-model="models.model.isQualified"
                            direction="horizontal"
                        >
                            <van-radio
                                v-for="(item, index) in conclusionList"
                                :key="index"
                                :name="item.code"
                                >{{ item.name }}
                            </van-radio>
                        </van-radio-group>
                    </van-field>
                    <van-field
                        v-model="models.model.checkOpinion"
                        label="检查意见"
                        rows="1"
                        autosize
                        type="textarea"
                        placeholder="请输入"
                    >
                    </van-field>
                    <van-field
                        readonly
                        required
                        class="label-all file"
                        name="datetimePicker"
                        label="维保记录表"
                    />
                    <qm-file-upload
                        v-if="conclusionPicBiz"
                        ref="conclusionPic"
                        :galleryOptions="{ multiple: true, maximum: 9 }"
                        :disabled="
                            models.model.repairStatus != 2 ||
                            !models.isRepairUser
                        "
                        :params="{
                            type: 'attach',
                            dataKey: models.model.repairId,
                            bizType: conclusionPicBiz,
                        }"
                        uploadId="conclusionPic"
                    >
                    </qm-file-upload>
                </v-accordion>
            </van-form>
            <f7-toolbar
                position="bottom"
                no-shadow
                class="fff"
                v-if="models.model.repairStatus == 2 && models.isRepairUser"
            >
                <f7-button fill class="submit-btn" @click="sure(3)"
                    >提交
                </f7-button>
            </f7-toolbar>
            <f7-toolbar position="bottom" no-shadow class="fff" v-if="isWrite3">
                <f7-button
                    fill
                    class="submit-btn back-btn"
                    @click="showPinion = true"
                    >退回
                </f7-button>
                <f7-button fill class="submit-btn" @click="sure(4)"
                    >通过
                </f7-button>
            </f7-toolbar>

            <!-- 审核意见 -->
            <v-popup-opinion
                v-model="showPinion"
                :selectUser="selectUser"
                ref="opinion"
                @save="emitSave"
            >
            </v-popup-opinion>
            <!-- 审核意见 end -->
        </div>
        <div class="content-list" v-if="currentStep > 3">
            <v-accordion title="业务流程" class="infoList noBorder" disabled>
                <v-workflow-step
                    :data="stepsLabel"
                    stepName="name"
                    :showSubtitle="false"
                ></v-workflow-step>
            </v-accordion>
            <v-accordion title="操作记录" class="infoList noBorder" disabled>
                <v-workflow-list
                    :data="controlData.workItem"
                ></v-workflow-list>
            </v-accordion>
        </div>
    </f7-page>
</template>

<script>
import Config from '@/libs/config.js'
import Steps from './components/steps.vue'
import vPopupPerson from './components/v-popup-person.vue'
import vPopupDevice from './components/v-popup-device.vue'
import controller from '@/libs/framework/controller'

export default class instance extends controller {
    onBeforeInit() {
        this.urls = {
            model: '/equipment/eqmRepair/getEntity',
            save: '/equipment/eqmRepair/save',
            remove: '/equipment/eqmRepair/delete'
        }
    }

    onInit() {}

    onAfterQuery(type, isSuccess, result) {
        if (type == 'form') {
            if (result.models.model.repairStatus == 3) {
                this.$data.activeStep = result.models.model.repairStatus - 1
            } else {
                this.$data.activeStep = result.models.model.repairStatus
            }
            this.$data.currentStep = result.models.model.repairStatus
            if (this.$data.currentStep == 2 || this.$data.currentStep == 3) {
                this.$data.activeIndex = 2
            } else if (this.$data.currentStep > 3) {
                this.$data.activeIndex = 3
            } else {
                this.$data.activeIndex = this.$data.currentStep
            }
            if (result.models.model.repairTime) {
                result.models.model.repairTime = formatter.formatDate(
                    result.models.model.repairTime,
                    'yyyy-MM-dd'
                )
            }
            this.$data.stepsLabel.forEach((element, index) => {
                if (this.$data.activeStep >= index) {
                    element.isActive = 2
                }
            })
            this.vm.getFile(
                'EQM_REPAIR',
                result.models.model.repairId,
                result.controlData.equipmentType,
                'conclusionPicBiz'
            )
            this.vm.loadLocation()
        }
        return result
    }

    onAfterSave(isSuccess, result) {
        if (isSuccess) {
            this.$f7.views.current.router.back({force:true})
        }
    }

    onAfterRemove (isSuccess, result) {
        if(isSuccess)this.$f7.views.current.router.back({force:true});
    }

    mixin() {
        return {
            components: {
                Steps,
                vPopupPerson,
                vPopupDevice,
            },
            data() {
                return {
                    minDate: new Date(2017, 0, 1),
                    maxDate: new Date(2080, 12, 1),
                    currentDate: new Date(),
                    showPicker: false,
                    download: Config.api.download,
                    controlData: {
                        auditInfo: {},
                        repairProcessList: [],
                    },
                    models: {
                        model: {},
                        staffList: [],
                        repairContentList: [],
                        prjEngineeOrg: {},
                    },
                    pageAction: '',
                    selectUser: {
                        selectComment: null,
                        comment: null,
                        comments: [],
                        tran: [],
                        activity: '',
                        users: [],
                    },
                    safeList: [],
                    personPicList: [],
                    processList: [],
                    stepsLabel: [
                        {
                            name: '维保计划',
                            img: 'wb-wbjh',
                            isActive: 0,
                        },
                        {
                            name: '人员核对',
                            img: 'jc-ryhd',
                            isActive: 0,
                        },
                        {
                            name: '维保现场',
                            img: 'jc-jcxc',
                            isActive: 0,
                        },
                        {
                            name: '资料审核',
                            img: 'wb-zlsh',
                            isActive: 0,
                        },
                    ],
                    currentStep: null,
                    activeIndex: null,
                    activeStep: null,
                    personList: [],
                    showProject: false,
                    showDevice: false,
                    conclusionList: [
                        {
                            name: '合格',
                            code: true,
                        },
                        {
                            name: '不合格',
                            code: false,
                        },
                    ],
                    showPinion: false,
                    conclusionPicBiz: '',
                    address: '',
                }
            },
            computed: {
                isWritePlan() {
                    // 草稿状态下允许编辑
                    if(this.models.model.repairStatus == 0) {
                        return true;
                    }
                    // 在没有完成人员进场刷脸的情况下，可以编辑
                    if(this.models.model.repairStatus == 1 && this.models.isRepairUnit) {
                        var isWrite = true;
                        this.models.staffList.every((element) => {
                            if(element.authTime) {
                                isWrite = false;
                                return false;
                            }
                        })
                        return isWrite;
                    }
                    // 其余情况不允许编辑
                    return false;
                },
                isWrite1() {
                    var isWrite = false
                    if (
                        this.models.model.repairStatus == 1 &&
                        this.models.prjEngineeOrg.orgTypeCode &&
                        this.models.prjEngineeOrg.orgTypeCode == 'SUPERVISOR'
                    ) {
                        isWrite = true
                    }
                    return isWrite
                },
                isWrite3() {
                    var isWrite = false
                    if (
                        this.models.model.repairStatus == 3 &&
                        this.models.prjEngineeOrg.orgTypeCode &&
                        this.models.prjEngineeOrg.orgTypeCode == 'CONSTRUCTION'
                    ) {
                        isWrite = true
                    }
                    return isWrite
                },
            },
            mounted() {},
            methods: {
                delCreate(){
                    this.remove()
                },
                //获取地址
                loadLocation() {
                    let self = this
                    self.$util.getCurrentPosition(
                        (pos) => {
                            if (pos.addresses) {
                                self.address = pos.addresses
                            } else {
                                self.address = pos.data.name
                            }
                        },
                        (error) => {
                            // self.$f7.dialog.toast(
                            //     '获取定位失败,请确认是否授权定位功能'
                            // )
                        }
                    )
                },
                getFile(typeCode, dataKey, attachCraneType, biz) {
                    this.$f7.request.post(
                        '/admin/attachmentFormDetail/listUpload',
                        {
                            typeCode: typeCode,
                            dataKey: dataKey,
                            attachCraneType: attachCraneType,
                        },
                        (r) => {
                            r = JSON.parse(r)
                            if (r?.success && r.parameters.fileList) {
                                this.picList = r.parameters.fileList
                                this[`${biz}`] =
                                    r.parameters.fileList[0].bizType
                            } else {
                                this.$framework.$f7.dialog.toast('获取文件失败')
                            }
                        }
                    )
                },
                getSafe(list) {
                    this.safeList = list
                },
                getPerson(list) {
                    this.personPicList = list
                },
                getProcess(list) {
                    this.processList = list
                },
                onChange(index) {
                    // 父组件获取切换后的选中步骤
                    if (index == 3) {
                        this.currentStep = index + 1
                    } else {
                        this.currentStep = index
                    }
                    if (this.currentStep == 2 || this.currentStep == 3) {
                        this.activeIndex = 2
                    } else if (this.currentStep > 3) {
                        this.activeIndex = 3
                    } else {
                        this.activeIndex = this.currentStep
                    }
                },
                //确定验收时间
                onConfirm(time) {
                    this.models.model.repairTime = this.$formatter.formatDate(
                        time,
                        'yyyy-MM-dd'
                    )
                    this.showPicker = false
                },
                deletePerson(index) {
                    if (this.isWritePlan) {
                        this.models.staffList.splice(index, 1)
                    }
                },
                checkPerson(index) {
                    this.models.staffList[index].authTime =
                        this.$formatter.formatDate(
                            new Date(),
                            'yyyy-MM-dd hh:mm:ss'
                        )
                },
                //选择人员
                suerPart(personList) {
                    this.models.staffList=JSON.parse(JSON.stringify(personList))
                    // if (result.length > 0) {
                    //     this.models.staffList = []
                    //     personList.forEach((element) => {
                    //         result.forEach((element2) => {
                    //             if (element2 == element.certId) {
                    //                 this.models.staffList.push(element)
                    //             }
                    //         })
                    //     })
                    // }
                },
                //选择设备
                suerDevice(result) {
                    if (result.propertyId) {
                        this.models.model.propertyCode = result.propertyCode
                        this.models.model.propertyId = result.propertyId
                        this.models.model.useId = result.useId
                    }
                },
                mobileRegex(val) {
                    if (!val) {
                        return false
                    } else {
                        return /^0{0,1}(13[0-9]|14[01456789]|15[012356789]|16[2567]|17[012345678]|18[0-9]|19[012356789])[0-9]{8}$/.test(
                            val
                        )
                    }
                },
                isQual(val) {
                    if (val == null) {
                        return false
                    }
                },
                //提交
                sure(index) {
                    var self = this
                    self.models.repairId = self.models.model.repairId
                    if (index == 1) {
                        if (self.models.staffList.length == 0) {
                            self.$toast('请至少添加一位维保人员')
                            return
                        }
                        self.$refs.form
                            .validate()
                            .then((_) => {
                                self.models.model.repairStatus = index
                                self.save()
                            })
                            .catch((err) => {
                                console.log(err)
                            })
                    } else if (index == 2) {
                        let flag = self.models.staffList.every(function (
                            currentValue
                        ) {
                            return currentValue.authTime
                        })
                        if (!flag) {
                            self.$toast('人员未全部核对！')
                            return
                        }
                        self.models.model.repairStatus = index
                        self.save()
                    } else if (index == 3) {
                        if (!self.$refs.safeListTotal.getUploadedCount()) {
                            self.$toast('请上传安全教育相关附件')
                            return
                        }
                        if (!self.$refs.personListTotal.getUploadedCount()) {
                            self.$toast('请上传人员旁站相关附件')
                            return
                        }
                        if (!self.$refs.processListTotal.getUploadedCount()) {
                            self.$toast('请上传维保过程相关附件')
                            return
                        }
                        self.$refs.formData2
                            .validate()
                            .then((_) => {
                                if (
                                    self.$refs.conclusionPic.getUploadedCount() <
                                    1
                                ) {
                                    self.$toast('请上传维保记录表')
                                    return false
                                }
                                self.models.model.repairStatus = index
                                self.save()
                            })
                            .catch((err) => {
                                console.log(err)
                            })
                    } else if (index == 4) {
                        self.models.model.repairStatus = index
                        self.save()
                    }
                },
                // 提交
                emitSave() {
                    if (!this.selectUser.comment) {
                        this.$toast('请填写审核意见')
                        return false
                    }
                    this.models.feedback = this.selectUser.comment
                    this.models.model.repairStatus = 2
                    this.showPinion = false
                    this.save()
                },
            },
        }
    }
}
</script>

<style lang="less" scoped>
@import url('../../../../assets/css/qualityCreate.less');

@deep: ~'>>>';

@{deep} .page-content {
    overflow-x: hidden;
    padding-top: 0;
}
@{deep}.van-form .accordion .accordion-item > .item-link > .item-content{
    padding-left: 16px !important;
}
.hntsh {
    .content-list {
        padding: 0 0 50px;
    }

    @{deep} .v-workflow-step,
    @{deep} .v-workflow-list {
        padding: 0 16px;
    }

    @{deep} .pic_upload {
        padding-top: 10px;
    }

    @{deep} .toolbar,
    @{deep}.navbar {
        position: fixed;
    }
    @{deep}li .content-box {
        padding: 10px 15px;
    }
    .wbList {
        .content-box {
            padding: 10px 15px;
            display: flex;
            align-items: flex-start;
        }

        .index-box {
            padding: 2px 8px;
            background: rgba(51, 133, 255, 0.1);
            border-radius: 1px;
            font-size: 13px;
            color: #1990ff;
        }

        .right-box {
            margin-left: 10px;
            font-size: 14px;
            color: #333;
            flex: 1;
        }

        @{deep}.van-cell {
            &::after {
                left: 0;
                right: 0;
            }

            padding: 0;
        }

        @{deep}.van-cell--required::before {
            left: 0;
        }
    }

    .pic-total {
        @{deep}.content-box {
            padding: 10px 15px;
        }
    }
}
</style>
